{% load static %}
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Python字符串</title>
<style>
		html, body {
			height: 100%;
			margin: 0px;
			padding: 0px;
		}

		.div-a{ float:left;width:50%;height:100%;border:1px solid #F00;overflow-y:scroll}
		.div-b{ float:right;width:49%;height:100%;border:0px solid #000}


        div#butt	{
            height:50px;
            border-bottom: 0px solid #c5c5c5;
            background:#fff;
            }

        div#butt input {
            margin:10px 0 0 10px;
            background:blueviolet;
            color:#fff;
            width:150px;
            height:30px;
            font:14px Verdana, Arial, Helvetica, sans-serif;
            }

        form{

            height:45%;
            width:100%;
            margin-left:0px;
			border:0px solid #c5c5c5;
            }
		#CodeArea{
			height:100%;
            width:100%;
            margin-left:0px;
		}
        #TestCode{
            height:85%;
			width:99%;
            overflow:auto;
            border:1px solid #c5c5c5;
            font:14px "Courier New", Courier, monospace;
            }
        #CodeArea h2	{
            margin:10px 0 6px 5px;
            color:brown;
            font-size:14px;
            }

        #result	{
            height:48%;
            width:100%;
			margin-left:0px;
			border:0px solid red;
            }
		#output{
            width:99%;
            height:85%;
            overflow:auto;
            border:1px solid #c5c5c5;
            font:14px "Courier New", Courier, monospace;
            }

        #result h2	{
            margin:10px 0 6px 5px;
            color:brown;
            font-size:14px;
            }

</style>
<script src="{% static "common/jquery-1.8.2.js" %}" type="text/javascript"></script>
</head>
<body>
<div class="div-a">
    <li data-role="list-divider" data-theme="b">Python字符串</li>
  <div id="" class="ui-body ui-body-a">
    <p>字符串是以单引号或者双引号括起来的任意文本，文本中的符号、空格也算在内，如”Don’t love me“，就表示D、o、n、‘、t、空格、l、o、v、e、空格、m、e这13个字符。</p><br/>
    <h3>创建字符串</h3>
    <p>
        创建字符串很简单，只要把用单引号或双引号表示的文本赋值给变量就可以。<br/>
    示例：<br/>
    >>> m='abc'<br/>
    >>> m<br/>
    'abc'<br/>
     </p>
    <h3>常用字符串操作</h3>
    <p>
        字符中含有单引号和双引号的表示，用转义字符\来标识，放在要显示的单引号或者双引号前<br/>
示例：<br/>
>>> m='don\'t love me'<br/>
>>> m<br/>
’don't love me’<br/>
字符串换行，用转义字符\n来表示要换行。<br/>
示例：<br/>
>>> print 'I \nwill \nkill \nyou'<br/>
I <br/>
will <br/>
kill <br/>
you<br/>
如果要写一个非常长的字符串，内部换行比较多时，可以用'''...'''来表示换行。<br/>
示例：<br/>
>>> '''I<br/>
will<br/>
kill<br/>
you'''<br/>
I<br/>
will<br/>
kill<br/>
you<br/>
换行符\n以及制表符\t的用法，\n表示接下来内容换行，\t表示接下来内容显示时前面留出空白。<br/>
示例：<br/>
>>> print 'Dear:\n\tI love you forever!'<br/>
Dear:<br/>
I love you forever!<br/>
拼接字符串：Python中可以用+像加法一样把字符串拼接在一起。<br/>
示例：<br/>
>>> a='hello,'<br/>
>>> b='world'<br/>
>>> a+b<br/>
'hello,world'<br/>
     </p>

    <h3>常用的字符串方法</h3>
    <p>
        <b>strip():</b>去掉字符串两边的空白符<br/>
示例：<br/>
>>> m='  I love you  '<br/>
>>> m<br/>
'  I love you  '<br/>
>>> m.strip()<br/>
'I love you'<br/>
<b>split():</b>将字符串分割成序列，括号内为分隔符，如果不指定分隔符，程序将默认空格为分隔符。<br/>
示例：<br/>
>>> m='I love you forever'<br/>
>>> m.split()<br/>
['I', 'love', 'you', 'forever']<br/>

>>> '1+2+3+4+5'.split('+')<br/>
['1', '2', '3', '4', '5']<br/>
<b>join():</b>split方法的逆运算，是将序列串联成字符串，引号内为分隔符，括号内为要串联的序列。<br/>
示例：<br/>
>>> n=','.join(m)<br/>
>>> n<br/>
'I,love,you,forever'<br/>
<b>replace():</b>替换字符串中的指定内容。<br/>
示例：<br/>
>>> 'He is a girl'.replace('He','She')<br/>
'She is a girl'<br/>
<b>lower():</b>将字符串中所有字母变为小写。<br/>
示例：<br/>
>>> 'This Is An Apple'.lower()<br/>
'this is an apple'<br/>
     </p>
  </div>

</div>
<div class="div-b">
	<form action="#" method="post" id="tryitform" name="tryitform" onSubmit="validateForm();" target="i" id="form-a">
		<div id="CodeArea">
		<h2>编辑您的代码：</h2>
		<textarea id="TestCode" wrap="logical">
#!/usr/bin/python
# -*- coding: utf-8 -*-
#------------------------
m='abc'
print m
#------------------------
m1='don\'t love me'
print m1
print 'I \nwill \nkill \nyou'
print '''I
will
kill
you'''

print 'Dear:\n\tI love you forever!'

#------------------------
a='hello,'
b='world'
print a+b
#----------strip()--------------
m='  I love you  '
print m
print m.strip()
#----------split()--------------
m='I love you forever'
print m.split()
x='1+2+3+4+5'.split('+')
print x
#----------join()--------------
n=['I', 'love', 'you', 'forever']
nn=','.join(n)
print nn

#----------replace()--------------
mm='He is a girl'
print mm.replace('He','She')
#----------lower()--------------
print 'This Is An Apple'.lower()

		</textarea>
		</div>
		<input type="hidden" id="code" name="code"  />

	</form>
<div id="butt">
		<input type="button" value="提交代码" onClick="submitTryit()" id="submit">
		</div>
	<div id="result">
		<h2>查看结果:</h2>
		<textarea id="output" wrap="logical"></textarea>
	</div>
</div>
<script type="text/javascript">
	function submitTryit()
	{

	    var t=document.getElementById("TestCode").value;

	    document.getElementById("code").value=t;

	    validateForm();
        $.ajax({
         type:"GET",
         url:"/moon/codeHandler",
         data:{"code":t},
         success:function(ret){
            $('#output').html(ret.result)
            }
        })

	}

	function validateForm()
	{
	var code=document.getElementById("code").value;
	if (code.length>5000)
		{
		document.getElementById("code").value="<h1>Error</h1>";
		}
	}
</script>
</body>
</html>
